<template>
  <div>
    <h1>数据的绑定</h1>
    <div v-once>只会渲染一次,: {{ msg }}</div>
    <div v-text="msg">{{ msg }}</div>
    <div> {{ msg }} 插值表达式和v-text是一样的效果</div>
    v-html 可以渲染标签 <div v-html="html"> </div>
    相互绑定<input type="text" v-model="msg">
    <div>
      {{ num + 1 }}
      {{ ok ? 'YES' : 'NO' }}
      {{ msg.split('').reverse().join('-') }}</div>
  </div>
</template>

<script>
export default {
  name: 'chp-01',
  data () {
    return {
      num: 0,
      msg: 'msg',
      ok: false,
      html: '<h1>数据的绑定</h1>'
    }
  }
}
</script>

<style lang="css" scoped>
</style>
